<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML >
<html>
	<head>
		<title>My JSP 'welcome.jsp' starting page</title>
		<meta HTTP-EQUIV="refresh" CONTENT="3000">
		<script type="text/javascript" src="../resources/js/jquery.min.js"></script>
		<script type="text/javascript" src="../resources/js/operamasks-ui.min.js"></script>
		<link rel="stylesheet" type="text/css" href="../resources/css/apusic/om-apusic.css" />
		<!--<link rel="stylesheet" type="text/css" href="../resources/css/default/om-default.css" />-->
		<style type="text/css">
html,body {
	padding: 1;
	margin: 1;
}

#search-panel .input-text {
	margin-right: 20px;
	border-width: 1.5px;
	border-color: #cccccc;
	background-color: #f6f6f6;
	margin-bottom: 1px;
	height: 20px;
}

.rowdata {
	background-color: #FFFFE0;
}

.rowdata2 {
	background-color: #FFFACD;
}

.rowdata3 {
	background-color: #FFF0F5;
}
</style>
		<script type="text/javascript">
    	$(document).ready(function() {
    			$('#mytable').omGrid({
    			//title : '用户列表',
    			height:350,
    			width:'fit',
    			autoFit : true,
    			limit:10,
    			singleSelect:true,
    			colModel:[	{header:'用户名',name:'TSuCode',align:'center',width:170},
    						{header:'单位名称',name:'TSuName',width:170},
    						{header:'所属部门',name:'TSuCompanycode',width:170},
    						{header:'电话',name:'TSuPhone',width:170},
    						{header:'Email',name:'TSuEmail',width : 'autoExpand'}
    			],
    			dataSource:'../sysUser/getUsers.action',
    			rowDetailsProvider:function(rowData,rowIndex){
                	return '<font color="green">提示:</font>  姓名是<b> '+rowData.TSuName+' </b>的用户<br/>'
                            +'<b>注册时间：</b><font color="red">'+'2012年1月２４日'+'</font>';
            	},
            	rowClasses :['rowdata','rowdata2','rowdata3']
    		});
    		$('#mytable').omGrid({method : 'POST'});
    		$('#search-panel').omPanel({
    			title:'查询条件',
    			width:'fit',
    			collapsible:'true'
    			
    		});
    		$('#button-search').omButton({
    			onClick:function(e){
    				var userCode = $('#userCode').val();
    				var companyName = $('#companyName').val();
    				//var url = 'finduser.action?userCode='+userCode+'&&companyName='+companyName;
    				//$('#mytable').omGrid("setData",url);
    				$('#mytable').omGrid({extraData:{userCode:userCode,companyName:companyName} });
    			}
    		});
    	});	
    </script>

	</head>

	<body>
		<!--  
    <img alt="" src="../resources/images/building.JPG" height="100%" width="100%">
    -->
		<div id="search-panel" style="background-color: white;">
			<div id="panel1">
				<span><b style="color: #B03060">用户ID：</b> </span>
				<input type="text" id="userCode" onfocus="this.select();this.style.border='1px solid red';" onblur="this.style.border='1px solid gray';" class="input-text">
				<span><b style="color: #B03060">单位名称：</b> </span>
				<input type="text" id="companyName" onfocus="this.select();this.style.border='1px solid red';" onblur="this.style.border='1px solid gray';" class="input-text"　>
				<br />
				<div align="right">
					<span id="button-search">查 询</span>
				</div>
			</div>
		</div>
		<br />
		<table id="mytable"></table>
	</body>
</html>
